<template>
    <div class="success">
        <div class="kefu">
            <img class="kefu-img" src="../assets/kbx_ewm.png" alt="">
            <div class="kefu-title">提交成功</div>
            <div class="kefu-text">我们的定制师会在12小时内联系您，您也可以主动与我们联系。</div>
            <router-link class="kefu-back" to="/">返回首页</router-link>
        </div>

        <div class="content">
            <div class="content-title">如有问题，请通过以下方式直接联系我们!</div>
            <div  class="content-tel">国内：+86 400-100-5295</div>
            <div  class="content-tel">北美：+1 888-828-0899</div>
            <div  class="content-tel">微信：kbxmei</div>
            <img  class="content-weixin" src="../assets/ewm.png" >

        </div>

    </div>
</template>

<script>
    export default {
        name: "Formulate",

        data() {
            return {

            }
        },
        methods: {

        },
        mounted() {
            window.scrollTo(0,0);
        }

    }
</script>

<style lang="scss" scoped>
    @import "../assets/base";

    .h30 {
        height: rpx(30);
        background: $bgcolor1
    }

    .h120 {
        height: rpx(120);
        background: $bgcolor1;
    }
    .success {
        position: relative;
        background-image: url(../assets/formulate_success_bg.png);
        background-color: #fff;
        background-repeat: no-repeat;
        background-size: contain;
        min-height: 100%;


    }

    .kefu{
        padding: rpx(350) rpx(90) rpx(30);
        text-align: center;
        &-img{
            width: rpx(210);
            height: rpx(210);
        }
        &-title{
            padding: rpx(30) 0;
            font-size: rpx(36);
            font-weight: bold;
        }
        &-text{
            font-size: rpx(26);
            color: $color5;
            line-height: 180%;
            padding-bottom: rpx(20);
        }
        &-hao{
            text-align: center;
            &-btn{
                border: solid 1px $color3;
                padding: rpx(20) rpx(40);
                margin-left: rpx(20);
                border-radius: $radius10;
                font-size: rpx(30);
                color: $color3;
            }
        }
        &-back{
            display: block;
            margin-top: rpx(100);
            width: 100%;
            height: rpx(80);
            line-height: rpx(80);
            background: $color3;
            border-radius: $radius6;
            color: $color0;
            font-size: rpx(34);
            text-align: center;
        }
    }



    .content{
        position: relative;
        background: $color0;
        padding: rpx(60)  rpx(30);
        line-height: 200%;
        &-title{
            font-size: rpx(26);
            color: $color5;
            padding-bottom: rpx(20);
        }
        &-tel{
            font-size: rpx(26);
        }
        &-weixin{
            position: absolute;
            bottom: rpx(30);
            right: rpx(30);
            width: rpx(200);
            height: rpx(200);
        }
    }
</style>

